import {
  Component,
  OnInit,
  Input,
  Output,
  EventEmitter
} from '@angular/core';

export type btnType = 'default' | 'border' | 'full';
export type btnSize = 'big' | 'small' | 'middle';

@Component({
  selector: 'app-btn',
  templateUrl: './btn.component.html',
  styleUrls: [ './btn.component.less' ]
})
export class BtnComponent implements OnInit {
  private _disabled = false;
  @Input()
  get disabled() {
    return this._disabled;
  }
  set disabled(value: any) {
    this._disabled = value === '' ? true : !!value;
  }
  @Input() type: btnType = 'default';
  @Input() size: btnSize = 'middle';
  @Output() click: EventEmitter<any> = new EventEmitter;
  private get _typeClass() {
      return ` btn ${this.type} ${this.size} ${ this.disabled ? 'disabled' : '' }`;
  }
  constructor() { }
  ngOnInit() {
  }

  // 内置click, 模拟disabled
  private _click($event) {
    $event.preventDefault();
    $event.stopPropagation();

    if (!this.disabled) {
      this.click.emit($event);
     }
  }

}
